{
	template:`
	<div style="padding:0 10px 10px;">
        <a-row :gutter="16" style="margin-bottom:10px;">
            <a-col :span="10">
                <a-button type="link" @click="addAllNode">初始化</a-button>
                <a-tree :tree-data="eleTree" @select="treeSelect" @drop="treeDrop" :expandedKeys="expKeys" draggable >
                    <template #title="{ title, key }">
                        <span>{{ title }}</span><span v-if="key==selectEle.key">&nbsp;&gt;&gt;&gt;</span>
                    </template>
                </a-tree>
            </a-col>
            <a-col v-if="selectEle&&selectEle.title" :span="14">
                <h4>编辑&nbsp;<span>{{selectEle.title}}</span></h4>
                <a-form v-if="selectEle.model" class="index-form" :wrapper-col="{span:24}">
                    <a-row :gutter="10">
                        <a-col :span="10">
                            <a-form-item label="标题" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['title']" placeholder="请输入标题"></a-input>
                            </a-form-item>
                        </a-col>
                        <a-col :span="14">
                            <a-form-item label="子标题" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['subTitle']" placeholder="请输入子标题"></a-input>
                            </a-form-item>
                        </a-col>
                        <a-col :span="10">
                            <a-form-item label="method" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['method']" placeholder="请输入JAVA方法"></a-input>
                            </a-form-item>
                        </a-col>
                        <a-col :span="14">
                            <a-form-item label="功能" class="index-form-item-sm">
                                <a-checkbox v-model:checked="selectEle.attr['excel']">导出</a-checkbox>
                                <a-checkbox v-model:checked="selectEle.attr['chart']">图表</a-checkbox>
                                <a-checkbox v-model:checked="selectEle.attr['numCol']">序号列</a-checkbox>
                            </a-form-item>
                        </a-col>
                    </a-row>
                </a-form>
                <a-form v-if="selectEle.field" class="index-form" :wrapper-col="{span:24}">
                    <a-row :gutter="10">
                        <a-col :span="8">
                            <a-form-item label="field" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['field']" placeholder="请输入字段"/>
                            </a-form-item>
                        </a-col>
                        <a-col :span="8">
                            <a-form-item label="表头" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['title']" placeholder="请输入表头"/>
                            </a-form-item>
                        </a-col>
                        <a-col :span="8">
                            <a-form-item label="表头组" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['titleGroup']" placeholder="请输入表头组"/>
                            </a-form-item>
                        </a-col>
                        <a-col :span="8">
                            <a-form-item label="类型" class="index-form-item-sm">
                                <a-select v-model:value="selectEle.attr['type']" :options="fieldTypeOption" />
                            </a-form-item>
                        </a-col>
                        <a-col :span="8">
                            <a-form-item label="宽度" class="index-form-item-sm">
                                <a-input-number v-model:value="selectEle.attr['width']" placeholder="请输入宽度"/>
                            </a-form-item>
                        </a-col>
                        <a-col :span="8">
                            <a-form-item label="功能" class="index-form-item-sm">
                                <a-checkbox v-model:checked="selectEle.attr['filter']">筛选</a-checkbox>
                                <a-checkbox v-model:checked="selectEle.attr['sort']">排序</a-checkbox>
                            </a-form-item>
                        </a-col>
                        <a-col v-if="selectEle.attr['type']=='toImageColumn'" :span="8">
                            <a-form-item label="viewField" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['viewField']" placeholder="请输入图片列显示"/>
                            </a-form-item>
                        </a-col>
                        <a-col :span="16">
                            <a-form-item label="字典" class="index-form-item-sm">
                                <a-input v-model:value="selectEle.attr['dict']" placeholder="请输入字典"/>
                            </a-form-item>
                        </a-col>
                    </a-row>
                </a-form>
            </a-col>
        </a-row>
        <div style="text-align:right;margin:10px 0;">
            <a-space>
                <span style="color:#f30;">无保存功能，请及时复制保存成文件。</span>
                <a-button :disabled="eleTree.length==0" type="primary" @click="toCode">生成代码</a-button>
            </a-space>
        </div>
        <a-textarea v-model:value="codeStr" :auto-size="{ minRows: 3, maxRows: 30 }" placeholder="编辑完成可点击生成代码查看"/>
    </div>
	`,
	props: ['localeZh','param','parentVue'],
	data:function(){
		return {
		    eleTree:[],
		    expKeys:['method'],
		    idx:0,
		    selectEle:{},
		    fieldType:{toTextColumn:'文本列',toDateColumn:'日期列',toDateTimeColumn:'日期时间列',toNumberColumn:'数字列',toIntegerColumn:'整型列',
		        toStatusColumn:'状态列',toImageColumn:'图片列'},
		    fieldTypeOption:[],
		    codeStr:''
		};
	},
	mounted(){
	    for(let type in this.fieldType){
	        this.fieldTypeOption.push({value:type,label:this.fieldType[type]});
	    }
	},
	methods:{
	    addNode:function(field,type){//添加到node下，节点名称，插槽
            let attr={field:field.key.substring(6),title:field.field.description,type:type,width:100,filter:true};
            if(field.field.dictOption) attr.dict=field.field.clazz+'!'+field.field.field;
            if(field.field.dictType) attr.dict=field.field.dictType;
	        this.idx++;
	        let obj={field:field.field,attr:attr,key:"k"+this.idx,children:[]};
            this.eleTree[0].children.push(obj);
	        this.eleTree=[...this.eleTree];
	        return obj;
	    },
	    setNodeTitle:function(node){
	        let t;
	        if(node.model){
	            t=node.model.clazz+" ";
	            t+=(node.attr.method||'')+" "
	            t+=(node.attr.title||'')+" ";
	            t+=(node.attr.excel?'导出':'')+" ";
	            t+=(node.attr.chart?'图表':'')+" ";
	        }else{
	            t=node.attr.field+' '+node.attr.title+(node.attr.titleGroup?("("+node.attr.titleGroup+")"):'')+" ";
	            t+=this.fieldType[node.attr.type]+" ";
	            t+=node.attr.width+" ";
	            t+=(node.attr.filter?'筛选':'')+" ";
	            t+=(node.attr.sort?'排序':'')+" ";
	        }
	        node.title=t;
	    },
	    addAllNode:function(){
            this.parentVue.selectTableModel((model,fields)=>{
                this.eleTree=[{key:'method',model:model,attr:{},children:[]}];
                this.setNodeTitle(this.eleTree[0]);
                for(let i=0;i<fields.length;i++){
                    let f=fields[i];
                    let type='toTextColumn';
                    if(f.field.type=='INT'){
                        type='toIntegerColumn';
                    }else if(f.field.type=='DOUBLE'){
                        type='toNumberColumn';
                    }else if(f.field.type=='DATE'){
                        type='toDateColumn';
                    }else if(f.field.dictOption=='0:正常,9:禁用'){
                        type='toStatusColumn';
                        if(f.key!='model.status') continue;
                    }else if(f.field.clazz=='manage.model.ImageInfo'){
                        type='toImageColumn';
                    }
                    this.setNodeTitle(this.addNode(f,type));
                }
            });
	    },
	    delNode:function(key,list){
	        for(let i=0;i<list.length;i++){
	            let ele=list[i];
	            if(ele.key==key){
	                return list.splice(i, 1)[0];
	            }else{
	                let r=this.delNode(key,ele.children);
	                if(null!=r) return r;
	            }
	        }
	        return null;
	    },
	    appendNode:function(node,nextKey,list){
	        for(let i=0;i<list.length;i++){
	            let ele=list[i];
	            if(ele.key==nextKey){
	                list.splice(i+1, 0, node);;
	                return true;
	            }else{
	                if(this.appendNode(node,nextKey,ele.children)){
	                    return true;
	                }
	            }
	        }
	        return false;
	    },
	    unshiftNode:function(node,parentKey,list){
	        for(let i=0;i<list.length;i++){
	            let ele=list[i];
	            if(ele.key==parentKey){
	                ele.children.unshift(node);;
	                return true;
	            }else{
	                if(this.unshiftNode(node,parentKey,ele.children)){
	                    return true;
	                }
	            }
	        }
	        return false;
	    },
	    treeDrop:function(e){
	        let n1=e.dragNode,n2=e.node;
	        let pos1=n1.pos,pos2=n2.pos;
	        if(pos1.substring(0,pos1.lastIndexOf("-"))==pos2.substring(0,pos2.lastIndexOf("-"))){
                let node=this.delNode(n1.key,this.eleTree);
                if(null==n1.parent&&e.dropPosition==-1){
                    this.eleTree.unshift(node);
                }else{
                    this.appendNode(node,n2.key,this.eleTree);
                }
	        }else if(!e.dropToGap&&null!=n1.parent&&n1.parent.key==n2.key){
                let node=this.delNode(n1.key,this.eleTree);
                this.unshiftNode(node,n2.key,this.eleTree);
	        }else{
	            this.remind().error("只能拖拽到同级");
	        }
	    },
	    treeSelect:function(keys,e){
	        if(this.selectEle&&this.selectEle.title){
	            this.setNodeTitle(this.selectEle);
	        }
	        if(e.selectedNodes.length>0){
	            this.selectEle=e.selectedNodes[0];
	        }else{
	            this.selectEle={};
	        }
	    },
	    //转换成代码
	    toCode:function(){
	        let m=this.eleTree[0];
	        let clazz=m.model.clazz.substring(m.model.clazz.lastIndexOf(".")+1);
	        let hasStatus=false;
	        for(let i=0;i<m.children.length;i++){
                if(m.children[i].attr.type=='toStatusColumn') hasStatus=true;
            }
            let code='private '+clazz+' model;\r\n';
            code+='/*\r\n* 编辑'+m.attr.title+'\r\n*/\r\n'
                +'public VueResult toEdit() throws Exception {\r\n'
                +'\tverifyAdminOperPower(getStatusPower());//权限判断\r\n'
                +'\tif(null!=model&&!StringUtil.isSpace(model.getOid())){\r\n'
                +'\t\tmodel= ModelQueryList.getModel(model,"*");\r\n'
                +'\t}else{\r\n'
                +'\t\tmodel=new '+clazz+'();\r\n'
                +'\t}\r\n'
                +'\tModelForm form = new ModelForm("修改'+m.attr.title+'");\r\n'
                +'\tform.addItem(\r\n';
            for(let i=0;i<m.children.length;i++){
                let col=m.children[i];
                if(col.attr.type=='toStatusColumn'){
                    //
                }else if(col.attr.type=='toIntegerColumn'||col.attr.type=='toNumberColumn'){
                    code+='\t\tFormInput.number("'+col.attr.title+'", "model.'+col.attr.field+'").setPlaceholder("请输入'+col.attr.title+'"),\r\n';
                }else if(col.attr.type=='toImageColumn'){
                    code+='\t\tFormInput.selectImage("'+col.attr.title+'", "model", "'+col.attr.field+'",""),\r\n';
                }else if(col.attr.type=='toDateColumn'){
                    code+='\t\tFormInput.date("'+col.attr.title+'", "model.'+col.attr.field+'").setPlaceholder("请输入'+col.attr.title+'"),\r\n';
                }else if(col.attr.dict){
                    code+='\t\tFormInput.select("'+col.attr.title+'", "model.'+col.attr.field+'", "'+col.attr.dict+'").setPlaceholder("请选择'+col.attr.title+'"),\r\n';
                }else{
                    code+='\t\tFormInput.input("'+col.attr.title+'", "model.'+col.attr.field+'").setPlaceholder("请输入'+col.attr.title+'"),\r\n';
                }
            }
            code+='\t\tFormHtml.ins("")\r\n'
                +'\t)\r\n'
                +'\t.addData("model",model)\r\n'
                +'\t.addButton(\r\n'
                +'\t\tFormButton.pri("保存","doSave")\r\n'
                +'\t)\r\n'
                +'\t.addMethod(\r\n'
                +'\t\tFormEvent.backFlag,\r\n'
                +'\t\tFormEvent.doJson("doSave",actionUrl("doSave"),"{model:this.model}")\r\n'
                +'\t\t\t.success("backFlag")\r\n'
                +'\t);\r\n'
                +'\tVueFormResult result=new VueFormResult();\r\n'
                +'\treturn result.addForm(form);\r\n'
                +'}\r\n';

            code+='/*\r\n* '+m.attr.title+'列表\r\n*/\r\n'
                +'public VueResult '+m.attr.method+'() throws Exception {\r\n'
                +(hasStatus?'\tboolean power=hasAdminOperPower(getStatusPower());\r\n':'')
                +'\tVueListResult result=getVueListResult("'+m.attr.title+'列表",'+clazz+'.class,actionUrl("'+m.attr.method+'"));\r\n';
            if(m.attr.subTitle) code+='\tresult.setSubTitle("'+m.attr.subTitle+'");\r\n'
            if(m.attr.excel||m.attr.chart) code+='\tresult.setFunction('+(m.attr.excel||false)+','+(m.attr.chart||false)+');\r\n';
            code+="\tresult.setHeight(-1);\r\n";
            if(m.attr.numCol) code+='\tresult.addCol(toIndexColumn());\r\n';
            for(let i=0;i<m.children.length;i++){
                let col=m.children[i];
                if(col.attr.type=='toStatusColumn'){
                    code+='\tresult.addCol(toStatusColumn(power, '+col.attr.filter+')';
                }else if(col.attr.type=='toImageColumn'){
                    code+='\tresult.addCol(toImageColumn("'+col.attr.title+'", "'+col.attr.field+'", "'+col.attr.viewField+'", '+col.attr.width+')';
                }else{
                    code+='\tresult.addCol('+col.attr.type+'("'+col.attr.title+'", "'+col.attr.field+'", '+col.attr.width+', '+col.attr.filter+')'
                }
                if(col.attr.dict) code+='.setDictType("'+col.attr.dict+'")';
                if(col.attr.sort) code+='.setSort(true)';
                if(col.attr.titleGroup) code+='.setGroupTitle("'+col.attr.titleGroup.replace(/,/g,'","')+'")';
                code+=");\r\n";
            }
            code+='\tresult.addCol(toSpaceColumn("操作", 100,\r\n'
                +'\t\tListButton.modal("修改", ButtonType.PRIMARY,actionUrl("toEdit"),1000, SuccessMethod.REFRESH)\r\n'
                +'\t\t\t.addParam("oid","oid")\r\n'
                +'\t).setFixed(Align.RIGHT));\r\n'
                +'\tresult.addButton(\r\n\t\tListButton.modal("新增", ButtonType.PRIMARY,actionUrl("toEdit"),1000, SuccessMethod.REFRESH)\t\n\t);\r\n'
                +'\t//排序 result.addOrder\r\n\t//查询条件 result.addCondition\r\n';
            code+="\treturn result;\r\n}\r\n";
            if(hasStatus){
                code+='@Override\r\n'
                +'public String[] getStatusPower() {\r\n'
                +'\treturn new String[]{};\r\n'
                +'}\r\n'
            }
            code+='@Override\r\n'
            +'public '+clazz+' getModel() {\r\n'
            +'\treturn model;\r\n'
            +'}\r\n'
            +'public void setModel('+clazz+' model) {\r\n'
            +'\tthis.model = model;\r\n'
            +'};\r\n'
            this.codeStr=code;
	    },
	}
}